<!--
 * @authors 沙洲 chenchenyixin@qq.com http://gitee.com/shazhou
 * @date    2019-12-30 10:11:57
-->
<template>
  <div class="raise">
    <div class="wrapper" ref="wrapper">
      <div class="wrapper-content">
        <Tswiper class="Tswiper" :items="items"></Tswiper>
        <panel title="每日签到" more="不抢白不抢">
        	<section class="content">
        		<div class="item">
        			<img src="//img12.360buyimg.com/jrpmobile/jfs/t3184/283/6032981290/37056/fa30c674/589bd5a2Nabdbbbd9.jpg?width=376&height=160" alt="">
        		</div>
        		<div class="item">
        			<img src="//img12.360buyimg.com/jrpmobile/jfs/t3298/196/6130416421/33755/a0536d3e/589bd5d4Nf32e7adc.jpg?width=374&height=160" alt="">
        		</div>
        	</section>
        </panel>
        <panel title="In货推荐">
        	<listIn v-for="(item,index) of listItems" :key="index" :items="item"></listIn>
        </panel>
        <panel class="hasmore" title="更多福利" more="专享福利">
        	<section class="Fcontent">
        		<div class="Fitem" v-for="(item,index) of fuli" :key="index">
        			<img :src="item.src" alt="">
        		</div>
        	</section>
        </panel>
        <Tfooter></Tfooter>
      </div>
    </div>
  </div>
</template>

<script>
import BScroll from 'better-scroll'
import Tfooter from '../../components/footer.vue'
import panel from '../../components/panel.vue'
import Tswiper from '../../components/Tswiper.vue'
import listIn from '../raise/components/listIn.vue'
export default {
  name: 'raise',
  data(){
	  return{
	  	items:[{
	  		dsc:'签到领流量，1元500M'
	  	},{
	  		dsc:'百万白条券免费送，速来领取！！'
	  	}],
	  	listItems:[{
	  		Bimg:'//img12.360buyimg.com/jrpmobile/jfs/t3406/210/2247820735/50952/86016eea/5846d8e7N20446dbd.png?width=750&height=200',
	  		list:[{
	  			src:'https://img30.360buyimg.com/cf/s250x250_jfs/t14881/283/656508232/143980/9b606acf/5a33a171N18c9c80a.jpg',
	  			title:'双响炮蓝牙音箱',
	  			price:'29.00',
	  			rate:'72%'
	  		},{
	  			src:'https://img30.360buyimg.com/cf/s250x250_jfs/t15529/308/632300625/135123/adb9c6d0/5a37676dNc31da9ea.jpg',
	  			title:'脑波相机',
	  			price:'998.00',
	  			rate:'259%'
	  		}]
	  	},{
	  		Bimg:'//img12.360buyimg.com/jrpmobile/jfs/t3739/82/2244582797/54399/746c7d79/5846a953N66b67d05.png?width=750&height=200',
	  		list:[{
	  			src:'https://img30.360buyimg.com/cf/s250x250_jfs/t11257/287/2281727659/55759/e00b90a/5a138f21N32dca834.jpg',
	  			title:'智能电动牙刷',
	  			price:'19.00',
	  			rate:'481%'
	  		},{
	  			src:'https://img30.360buyimg.com/cf/s250x250_jfs/t14209/293/662014092/61635/bba5c330/5a33a983N077cac56.jpg',
	  			title:'烟草加热电子烟',
	  			price:'258.00',
	  			rate:'105%'
	  		}]
	  	},{
	  		Bimg:'//img12.360buyimg.com/jrpmobile/jfs/t3214/113/4408032436/61548/ce316eef/5846d310Ne93f00c9.png?width=750&height=200',
	  		list:[{
	  			src:'https://img30.360buyimg.com/cf/s250x250_jfs/t15007/47/884045069/149879/17987250/5a3cb182N15868ea1.jpg',
	  			title:'赖公高淮封藏老酒',
	  			price:'99.00',
	  			rate:'199%'
	  		},{
	  			src:'https://img30.360buyimg.com/cf/s250x250_jfs/t14197/160/546457496/134173/4e1baccd/5a30ccc5Na44f7492.jpg',
	  			title:'泗洪花雕醉蟹',
	  			price:'58.00',
	  			rate:'223%'
	  		}]
	  	}],
	  	fuli:[{
	  		src:'//img12.360buyimg.com/jrpmobile/jfs/t7456/56/1425209238/21928/f1fe492d/599cee57Naea99020.jpg?width=250&height=330'
	  	},{
	  		src:'//img12.360buyimg.com/jrpmobile/jfs/t7894/126/1440046618/24763/5ce6a129/599cee04Ne77b3641.jpg?width=250&height=330'
	  	},{
	  		src:'//img12.360buyimg.com/jrpmobile/jfs/t6385/103/1675552688/24265/91be4150/59549aedNa30670f7.jpg?width=250&height=330'
	  	}]
		}
  },
  props:{
  
  },
  components:{
  	Tfooter,panel,Tswiper,listIn
  },
  created(){

  },
  mounted(){
  	this.creatScroll()
  },
  methods:{
  	creatScroll(){
      this.$nextTick(() => {
        if(!this.scroll){
          this.scroll=new BScroll(this.$refs.wrapper,{
            click: true
          })
        }else{
          this.scroll.refresh()
        }
      })
    }
  }
}
</script>
<style lang="stylus" scoped>
@import '~@/assets/stylus/mixins.styl'
.raise
  position:absolute
  left:0
  top:50px
  right:0
  bottom:50px
  background:#f5f5f5
  overflow:hidden
	.wrapper
		height:100%
		.panel
	  	>>>.moreIcon
	  		display:none
	  	.content
	  		width:100%
	  		overflow:hidden
	  		list(flex,row)
	  		.item
	  			width:50%
	  			img
	  				width:100%
		  .hasmore
		  	>>>.moreIcon
		  		display:block
		.Tswiper
			background:#fff url(//m.jr.jd.com/spe/qyy/main/images/scroll_title_img.png) left center no-repeat
			background-size:70px
			margin:10px 0
			>>>.swiper-wrapper
				height:36px
				line-height:36px
				.swiper-slide
					padding-left:90px
					box-sizing:border-box
					list(flex,row)
					justify-content:space-between
					align-items:center
					font-size:12px
					color:#666
					.nut-icon-right
						float:right
						margin-right:10px
		.Fcontent
			list(flex,row)
			justify-content:space-between
			align-items:center
			padding:0 10px
			.Fitem
				width:33.33%
				img
					width:100%


  		



// .wrapper
// 		height:100%
// 	  .panel
// 	  	>>>.moreIcon
// 	  		display:none
// 	  	.content
// 	  		width:100%
// 	  		overflow:hidden
// 	  		list(flex,row)
// 	  		.item
// 	  			width:50%
// 	  			img
// 	  				width:100%
// 	  .hasmore
// 	  	>>>.moreIcon
// 	  		display:block
// 	.Tswiper
// 		background:#fff url(//m.jr.jd.com/spe/qyy/main/images/scroll_title_img.png) left center no-repeat
// 		background-size:70px
// 		margin:10px 0
// 		>>>.swiper-wrapper
// 			height:36px
// 			line-height:36px
// 			.swiper-slide
// 				padding-left:90px
// 				box-sizing:border-box
// 				list(flex,row)
// 				justify-content:space-between
// 				align-items:center
// 				font-size:12px
// 				color:#666
// 				.nut-icon-right
// 					float:right
// 					margin-right:10px
// 	.Fcontent
// 		list(flex,row)
// 		justify-content:space-between
// 		align-items:center
// 		padding:0 10px
// 		.Fitem
// 			width:33.33%
// 			img
// 				width:100%
</style>


